<meta title="电商类目绑定" width="600" args="shopcatId" />
<div class="p">
    <div class="p-b-xs">
        <div>
            <input autocomplete="off" type="button" s-click="addTaobao()" class="btn btn-primary btn-xs" value="添加淘宝类目"/>
            <input autocomplete="off" type="button" s-click="addDtk()" class="btn btn-primary btn-xs" value="添加大淘客类目"/>
            <input autocomplete="off" type="button" s-click="addJd()" class="btn btn-primary btn-xs" value="添加京东类目"/>
            <input autocomplete="off" type="button" s-click="addPdd()" class="btn btn-primary btn-xs" value="添加拼多多类目"/>
        </div>
    </div>
    <table
            id="grid"
            s='datac,nda'
            s-data="Smart.cleanJsonRef(S.get('/api/out-cat-to-shopcat/list/shopcat/' + shopcatId))"
            class="table table-stripped table-bordered">
        <tr>
            <th>平台</th>
            <th>类目名</th>
            <th>类目ID</th>
            <th class="text-right">操作</th>
        </tr>
        <tbody s="loop">
        <tr s-loop-role="empty">
            <td colspan="4" class="alert alert-warning">
                暂无数据
            </td>
        </tr>
        <tr s-loop-role="row" s="row,datac">
            <td name="platTitle"></td>
            <td name="catName"></td>
            <td name="catId"></td>
            <td s="tpl" class="text-right">
                <input autocomplete="off" type="button" s-click="del(this)" class="btn btn-xs btn-outline btn-danger" value="删除"/>
            </td>
        </tr>
        </tbody>
    </table>
</div>
<script type="text/javascript">

    S.meta.btns = [
        {
            name: "关闭",
            style: "btn btn-default",
            click: function() {
                S.close();
            }
        }
    ]
    function del($this) {
        var data = $this.parent().data()
        S.remove("/api/out-cat-to-shopcat/" + data.id).done(function() {
            $grid.refresh()
        })
    }
    function addTaobao($this) {
        S.popupOpen("/top/localItemCatSelector.html", {multi: true, parentCid: 0}).done(function(itemCats) {
            if(itemCats && itemCats.length) {
                create(itemCats.map(function(itemCat) {
                    return {
                        catId: itemCat.cid,
                        catName: itemCat.name,
                        plat: 'TAOBAO'
                    }
                }))
            }
        })
    }

    function addJd($this) {
        S.popupOpen("/jos/goodsCategorySelector.html", {multi: true}).done(function(cats) {
            if(cats && cats.length) {
                var cat = cats[0]
                create({
                    catId: cat.id,
                    catName: cat.name,
                    plat: 'JD'
                })
            }
        })
    }
    function addPdd($this) {
        S.popupOpen("/pdd/goodsCatSelector.html", {multi: true}).done(function(cats) {
            if(cats && cats.length) {
                var cat = cats[0]
                $this.node.parent().find(".pddCatId").val(cat.catId);
                $pddCatName.node.html(cat.catName)
                $pddCatNameInput.node.val(cat.catName)
                create({
                    catId: cat.catId,
                    catName: cat.catName,
                    plat: 'PDD'
                })
            }
        })
    }

    function create(itemCats) {
        itemCats.map(function(cat) {
            cat.shopcatId = shopcatId
            return cat
        })
        return S.post("/api/out-cat-to-shopcat", {
            params: JSON.stringify(itemCats)
        }).done(function() {
            $grid.refresh()
        })
    }
</script>